import React, { Component } from 'react';
import Taro from '@tarojs/taro';
import {View, Image} from '@tarojs/components'
import {CONTACT, RESOURCE_URL} from '../../constants/api'
import {h5Wx} from "../../utils/h5.service";
import {vcmonitor} from "../../utils/tools";
import {http} from "../../utils/http";
import GzhAuth from "../../components/gzh-auth/gzh-auth"
import './detail.scss'

export default class Empty extends Component {
  state: {
    phone: string
  } = {
    phone: ''
  }

  async componentDidShow() {
    vcmonitor(this);
  }

  async UNSAFE_componentWillMount() {
    if (process.env.TARO_ENV === 'h5') {
      await h5Wx.getConfig()
    }
    Taro.showLoading({title: '加载中...'})
    const res = await http.get(CONTACT, {})
    if (res) {
      if (res.contact_0 && res.contact_0.phone) {
        this.setState({phone: res.contact_0.phone})
      }
    }
    setTimeout(() => {
      Taro.hideLoading()
    }, 100)
  }

  render() {
    const {phone} = this.state
    return (
      <View className='appoint-detial appoint-detial-listNull'>
        <GzhAuth />
        <View className='listNull'>
          <Image src={`${RESOURCE_URL}/resources/images/shopnull.png`} mode='widthFix' />
          <View style='color:#333;font-size:14px'>暂无产品可预约，请联系商家</View>
          {phone && <View style='color:#333;font-size:14px;margin-top:4px'>客服电话：{phone}</View>}
        </View>
      </View>
    )
  }
}
